<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>疫苗视频</title>
		<meta name="description" content="">
		<meta name="keywords" content="">
		<meta name="renderer" content="webkit">
		<!-- 设置缩放 -->
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, minimal-ui" />
		<!-- 可隐藏地址栏，仅针对IOS的Safari（注：IOS7.0版本以后，safari上已看不到效果） -->
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<!-- 仅针对IOS的Safari顶端状态条的样式（可选default/black/black-translucent ） -->
		<meta name="apple-mobile-web-app-status-bar-style" content="black" />
		<!-- IOS中禁用将数字识别为电话号码/忽略Android平台中对邮箱地址的识别 -->
		<meta name="format-detection" content="telephone=no, email=no" />
		<!-- 启用360浏览器的极速模式(webkit) -->
		<meta name="renderer" content="webkit">
		<!-- 避免IE使用兼容模式 -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<!-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑莓 -->
		<meta name="HandheldFriendly" content="true">
		<!-- 微软的老式浏览器 -->
		<meta name="MobileOptimized" content="320">
		<!-- uc强制竖屏 -->
		<meta name="screen-orientation" content="portrait">
		<!-- QQ强制竖屏 -->
		<meta name="x5-orientation" content="portrait">
		<!-- UC强制全屏 -->
		<meta name="full-screen" content="yes">
		<!-- QQ强制全屏 -->
		<meta name="x5-fullscreen" content="true">
		<!-- UC应用模式 -->
		<meta name="browsermode" content="application">
		<!-- QQ应用模式 -->
		<meta name="x5-page-mode" content="app">
		<!-- windows phone 点击无高光 -->
		<meta name="msapplication-tap-highlight" content="no">
		<meta http-equiv="Cache-Control" content="no-siteapp" />
		<link rel="icon" type="image/png" href="../assets/i/favicon.png">
		<link rel="stylesheet" href="../assets/css/amazeui.css" />
		<link rel="stylesheet" href="../assets/videojs/video-js.min.css" />
		<link rel="stylesheet" href="../assets/css/beans.css" />
	</head>
	<body>
		<div id="">
			<!--导航条-->
			<div class="navui backwhite am-topbar am-topbar-fixed-top">
				<div class=" navui">
					<!--<img class="searcht" src="../img/sousuo.png" onclick="window.location.href='search.html'"/>-->
					<ul class="backwhite am-navbar-nav am-cf am-avg-sm-4 am-text-center w100" style="border-top:none;">
						<li class="" onclick="window.location.href='yuerjiangzuo.html'">育儿讲座</li>
						<li class="" onclick="window.location.href='yimiaozhishi2.html'">疫苗知识</li>
						<li class="activ" onclick="window.location.href='yimiaoshipin.html'">疫苗视频</li>
						<li class="" onclick="window.location.href='taolunhuodong.html'">讨论活动</li>
					</ul>
				</div>
			</div>
		    <div class="am-margin-top-sm radius4 zjyy_div paddgap">
				<ul class="am-avg-sm-1 zxhd_div_ul w100b">
				    <!--<li class="videoLi" style="background-color: white;">
				        <div class="example_video">
				            <video id="example_video_1" class="video-js vjs-default-skin hand" controls preload="none"  poster="../img/videos.jpg">
							   <source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
							</video>
							<p>
								<span class="videoname bold">疫苗名称</span>
								<span class="fenxiang">
									<img src="../img/shouc.png">
									<img src="../img/share.png">
								</span>
								<p class="time colorDCDC am-margin-top-xs">时间：<i>2018-07-17</i></p>
							</p>
						</div>
				    </li>--> 
				</ul>
				<div class="am-text-center more font14 colorb6bcce none am-margin-sm">
					<p>查看更多</p>
				</div>
			</div>
		</div>
	  	<div data-am-widget="navbar" class="am-navbar am-cf bg-fff" id="mendb">
			<ul class="am-navbar-nav am-cf am-avg-sm-4" style="border-top:none;">
				<li>
					<a href="index.html">
						<img src="../img/home.png">
						<span class="am-navbar-label">首页</span>
					</a>
				</li>
				<li class="active">
					<a href="yuerjiangzuo.html">
						<img src="../img/mamaban1.png">
						<span class="am-navbar-label">妈妈班</span>
					</a>
				</li>
				<li class="yimiao doctoras"></li>
				<li>
					<a href="personal.html">
						<img src="../img/geren.png">
						<span class="am-navbar-label">个人中心</span>
					</a>
				</li>
			</ul>
		</div>
		
		<!--收藏成功或失败的弹出框-->
		<div class="am-modal am-modal-no-btn" tabindex="-1" id="collection">
			<div class="am-modal-dialog" style="border-radius: 5px;">
			    <div class="am-modal-bd"></div>
			</div>
		</div>
		
		<div class="am-modal am-modal-loading am-modal-no-btn radius4" tabindex="-1" id="my-modal-loading" data-am-modal="{closeViaDimmer: 0}">
			  <div class="am-modal-dialog" style="border-radius: 4px;">
			    	<div class="am-modal-hd">加载中...</div>
				    <div class="am-modal-bd">
				      <span class="am-icon-spinner am-icon-spin"></span>
				    </div>
			  </div>
		</div>
		<script src="../assets/js/jquery.min.js"></script>
		<script src="../assets/js/jquery.cookie.js"></script>
		<script src="../assets/js/amazeui.min.js"></script>
		<script src="../assets/js/fastclick.min.js"></script>
		<script src="../assets/js/jquery.yomi.js"></script>
		<script src="../js/ym.js"></script>
		<script src="../js/wenda.js"></script>
		<script src="../js/public.js"></script>
		<script>
			$(function(){
				var pages;
				ym.ajax({
					url:'/video/getYmVideoKnowledge',
					success:function(data){
						var html = "";
						console.log(data);
						if(data.res ==1){
							pages = data.obj.pageNum;
							if(data.obj.results.length > 0){
								for(var i=0;i<data.obj.results.length;i++){
									var ress = data.obj.results[i];
									html = '<li class="videoLi" style="background-color: white;" id="'+ress.videoId+'">'+
												'<div class="example_video">'+
													'<video class="video-js vjs-default-skin hand" controls preload="auto"  poster="../img/videos.jpg">'+
														'<source src="'+ress.attachmentUrl+'" type="video/mp4">'+
													'</video>'+
													'<p>'+
														'<span class="videoname bold">'+ress.videoTitle+'</span>'+
														/*'<span class="fenxiang">'+
															'<img class="shouc" id="'+ress.start+'" src="../img/shouc.png">'+
															'<img src="../img/share.png">'+
														'</span>'+*/
														'<p class="time colorDCDC am-margin-top-xs">时间：<i>'+ress.strCreateDate+'</i></p>'+
										            '</p>'+
										         '</div>'+
										    '</li>';
									$('.am-avg-sm-1').append(html);
								}
							}else{
								html = '<li class="am-padding-sm am-text-center backwhite am-margin-top-sm">暂时还没有数据哦!</li>';
								$('.am-avg-sm-1').append(html);
							}
							if(data.obj.totalRecord > 5){
								$('.more').removeClass('none');
							}
							
						}else{console.log("数据获取失败！")}
					}
				});
				/*点击查看更多*/
				$('body').on('click','.more',function(){
					$("#my-modal-loading").modal('open');
					pages = pages + 1;
					ym.ajax({
						url:'/video/getYmVideoKnowledge',
						param:{ 
							pageNum:pages,
						},
						success:function(data){
							setTimeout(function(){
								$("#my-modal-loading").modal('close');
							},300)
							console.log(data);
							var htmlli = "";
							if(data.res ==1){
								for(var i=0;i<data.obj.results.length;i++){
									var ress = data.obj.results[i];
									html = '<li class="videoLi" style="background-color: white;" id="'+ress.videoId+'">'+
												'<div class="example_video">'+
													'<video class="video-js vjs-default-skin hand" controls preload="auto"  poster="../img/videos.jpg">'+
														'<source src="'+ress.attachmentUrl+'" type="video/mp4">'+
													'</video>'+
													'<p>'+
														'<span class="videoname bold">'+ress.videoTitle+'</span>'+
														/*'<span class="fenxiang">'+
															'<img class="shouc" id="'+ress.start+'" src="../img/shouc.png">'+
															'<img src="../img/share.png">'+
														'</span>'+*/
														'<p class="time colorDCDC am-margin-top-xs">时间：<i>'+ress.strCreateDate+'</i></p>'+
										            '</p>'+
										         '</div>'+
										    '</li>';
									$('.am-avg-sm-1').append(html);
					            }
				            	if(data.obj.results.length < 5){
									$('.more').html('');
									$('.more').html('<p>到底啦</p>');
									$('.more').removeClass('more');
								}
							}else{console.log("数据获取失败！")}
						}
					});
				})
				$('body').on('click','.shouc',function(){
					var collectiontypeid = $(this).parents('li').attr('id');
					var collectiontype = 5;
					if($(this).hasClass('you')){
						if(ym.collection(collectiontype,collectiontypeid)){
							$(this).attr('src','../img/pinglun.png');
							$(this).removeClass('you');
							$("#collection").find('.am-modal-bd').text('收藏成功!');
							$("#collection").modal('open');
							setTimeout(function(){ $("#collection").modal('close');}, 500);
						}else{
							console.log("取消收藏失败!");
						}
					}else{
						if(ym.collection(collectiontype,collectiontypeid)){
							$(this).attr('src','../img/collection.png');
							$(this).addClass('you');
							$("#collection").find('.am-modal-bd').text('收藏成功!');
							$("#collection").modal('open');
							setTimeout(function(){ $("#collection").modal('close');}, 500);
						}else{
							console.log("收藏失败!");
							$("#collection").find('.am-modal-bd').text('收藏失败!');
							$("#collection").modal('open');
							setTimeout(function(){ $("#collection").modal('close');}, 500);
						}
					}
				})
			})
		</script>
		
	</body>
</html>
